<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script>
    //定义一个Person  就是创建一个方法
    function Person(){}
    //实例化Person对象
    let p=new Person();
    //动态添加属性和方法
    p.name="张三";
    p.age=18;
    p.run=function (){
        console.log(this.name+":"+this.age);
    }
    //调用对象方法
    p.run();

    //定义一个自带属性和方法的对象
    function  Car(){
        this.name="兰博基尼";
        this.price=200;
        this.run=function (){
            console.log(this.name+":"+this.price);
        }
    }
    //实例化自带属性和方法的对象
    let c=new Car();
    c.run();

    //直接实例化空对象
    let p1={};
    //动态添加属性和方法
    p1.name="李爽";
    p1.age=26;
    p1.run=function (){
        console.log(this.name+":"+this.age)
    }
    //调用方法
    p1.run();

    //直接实例化带属性和方法的对象
    let p2={
        name:"吕布", age:50,
        run:function (){
            console.log(this.name+":"+this.age)
        }
    }
    //调用方法
    p2.run();

    //通过自定义对象封装数据  []表示数组
    let arr=[{title:"小米手机",price:3000,num:500},
        {title: "华为电视",price: 4000,num:400},
        {title: "鸿星尔克",price: 10000,num:50}];
    //forof循环相当于Java中的新循环
    for (let item of arr){
        let p=document.createElement("p");
        p.innerText="商品名:"+item.title+"价格："+item.price+"库存："+item.num;
        //把p添加到body里面
        document.body.append(p);
    }
</script>

<script>
    function Person(){}
    let p=new Person();
    p.name="王也";
    p.age=12;
    p.run=function (){
        console.log(this.name+":"+this.age);
    }
    //调用对象方法
    p.run();

    function Car(){
        this.name="劳斯莱斯";
        this.price=300;
        this.run=function (){
            console.log(this.name+":"+this.price);
        }
    }
    //实例化自带属性和方法的对象
    let c=new Car();
    c.run();

    let p1={}
    p1.name="李爽"
    p1.age=21;
    p1.run=function (){
       console.log(this.name+":"+this.age)
    }
    p1.run();
    //主要使用
    let p2={
        name:"吕布",
        age:45,
        run:function (){
            console.log(this.name+":"+this.age)
        }
    }
    p2.run();
</script>
</body>
</html>